<template>
  <base-breadcrumb>
    <searchData :searchData="searchArr" @search="search"></searchData>
    <a-card>
      <!-- <TitleName title="竣工台账"></TitleName> -->
      <list-table
        ref="table"
        :columns="columns"
        :startIndex="0"
        :request="loadData"
        :isShowCountBar="false"
        :exportConfig="{
          use: true,
          select: $route.meta.title,
          all: $route.meta.title,
          customColumns: columns
        }"
      >
        <a-button slot="prefix" type="primary" icon="plus" @click="handleAdd" v-btnPermission="'tm_001_add_01'"
          >新增资料</a-button
        >
        <div slot="suffix" class="table-operator mt12">
          <!-- <p>已竣工项目&nbsp;10&nbsp;个，已提交资料&nbsp;8&nbsp;个，提交率为&nbsp;80%</p> -->
          <div class="pub-table-select-count">
            <a-icon type="info-circle" theme="twoTone" />
            <span>已竣工项目：</span>
            <a>{{ totalInfo.completionNum || 0 }}个</a>
            <span>{{ ' | ' }}已提交资料项目：</span>
            <a>{{ totalInfo.submission || 0 }}个</a>
            <span>{{ ' | ' }}审核中：</span>
            <a>{{ totalInfo.submitted || 0 }}个</a>
            <span>{{ ' | ' }}审核通过：</span>
            <a>{{ totalInfo.past || 0 }}个</a>
            <span>{{ ' | ' }}审核不通过：</span>
            <a>{{ totalInfo.rejected || 0 }}个</a>
            <span>{{ ' | ' }}资料提交率：</span>
            <a>{{ totalInfo.subRate | filterRate }}</a>
            <span>{{ ' | ' }}通过率：</span>
            <a>{{ totalInfo.pastRate | filterRate }}</a>
          </div>
        </div>
        <span slot="description" slot-scope="text">
          <ellipsis :length="8" tooltip>{{ text }}</ellipsis>
        </span>
        <span slot="operation" slot-scope="text, record">
          <MoreButton>
          <a @click="addSee(record.id)" v-btnPermission="'tm_001_loo_04'">查看</a>
          <a
            @click="addEdit(record.id)"
            v-btnPermission="'tm_001_edi_02'"
            v-if="selfBtnShow(record.creatorId)&&(record.auditStatus == 'DRAFT' || record.auditStatus == 'REJECTED')"
            >编辑</a
          >
          <a
            v-if="record.auditStatus === 'DRAFT'&&selfBtnShow(record.creatorId)"
            @click="discard(record)"
            v-btnPermission="'tm_001_del_03'"
            >删除</a
          >
          <a
            v-if="record.auditStatus && record.auditStatus !== 'DRAFT'"
            @click="toggleApprovalDetails(record)"
            v-btnPermission="'tm_001_moi_05'"
            >审批信息</a
          >
            </MoreButton>
        </span>
        <span slot="auditStatusStr" slot-scope="text, record">
          <list-status :status="record.auditStatus" :isApproval="true" conversion="en" :text="text"></list-status>
        </span>
      </list-table>
    </a-card>
    <ApprovalDetails
      :visible="visible.approvalDetails"
      :businessId="childInitData.id"
      @cancel="visible.approvalDetails = false"
      @confirm="visible.approvalDetails = false"
    />
  </base-breadcrumb>
</template>

<script>
import ApprovalDetails from '@/components/approvalDetails'
import moment from 'moment'
import TitleName from '@/components/TitleName/index.vue'
import { getDataList, listDelete, increase, getTotalCount } from '@/api/standingBook'

import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import { STable } from '@/components'

const columns = [
  {
    title: '名称',
    dataIndex: 'name'
  },
  {
    title: '项目竣工时间',
    dataIndex: 'projectTime',
    ellipsis: true
  },
  {
    title: '项目竣备时间',
    dataIndex: 'completeDate',
    ellipsis: true
  },
  {
    title: '所属分公司',
    dataIndex: 'branchOffice',
    ellipsis: true
  },
  {
    title: '所属项目',
    dataIndex: 'projectName',
    ellipsis: true
  },
  {
    title: '填报时间',
    dataIndex: 'createTime',
    ellipsis: true
  },
  {
    title: '填报人',
    dataIndex: 'creatorName',
    ellipsis: true
  },
  {
    title: '状态',
    dataIndex: 'auditStatusStr',
    scopedSlots: { customRender: 'auditStatusStr' }
  },
  {
    title: '操作',
    dataIndex: 'operation',
    width: '170px',
    scopedSlots: { customRender: 'operation' }
  }
]
const searchArr = [
  {
    name: '所属单位',
    valueKey: 'searchQuery',
    type: OrgTreeSelect,
  },
  // {
  //   name: '所属分公司',
  //   valueKey: 'branchComId',
  //   type: SelectSubCompany
  // },
  // {
  //   name: '所属项目',
  //   keyValue: 'branchComId',
  //   valueKey: 'projectId',
  //   type: SelectProject
  // },
  {
    name: '竣工时间',
    value: 'completed',
    type: 'dateRange'
  },
  {
    name: '竣备时间',
    type: 'dateRange',
    value: 'callNameDate',
    attr: {
      rangeFormat: ['completeDateStart', 'completeDateEnd']
    }
  },
  {
    name: '填报时间',
    value: 'startEndDate',
    type: 'dateRange'
  },

  {
    name: '填报人',
    value: 'creatorName',
    type: 'input'
  },
  {
    name: '状态',
    value: 'auditStatus',
    type: 'select',
    data: typeListApproval
  }
]
import { typeListApproval } from '@/utils/util'
export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    TitleName,
    ApprovalDetails
  },
  filters: {
    filterRate(rate) {
      if (Number.isFinite(rate)) {
        return (rate * 100).toFixed(2) + '%'
      }
      return '0%'
    }
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      totalInfo: {}, // 统计信息
      visible: {
        approvalDetails: false
      },
      childInitData: {},
      queryParam: {},
      loading: false,
      loadData: parameter => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)

        if (this.queryParam.startEndDate) {
          requestParameters.fillingInTimeBegin = this.queryParam.startEndDate[0]
          requestParameters.fillingInTimeEnd = this.queryParam.startEndDate[1]
        }
        if (this.queryParam.completed) {
          requestParameters.timeForCompletionBegin = this.queryParam.completed[0]
          requestParameters.timeForCompletionEnd = this.queryParam.completed[1]
        }
        this.getTotalCountReq(requestParameters) // 调用统计
        return getDataList(requestParameters).then(res => {
          if (res.code === 200 || res.data.code === 200) {
            //   res.data.forEach(i=>{
            //       i.auditStatusStr=
            //   })
            return res
          } else {
            throw new Error('数据异常')
          }
        })
      }
    }
  },
  methods: {
    async getTotalCountReq(params) {
      try {
        const res = await getTotalCount(params)
        this.totalInfo = res.data || {}
      } catch (e) {
        console.error(e)
      }
    },
    toggleApprovalDetails(data) {
      this.childInitData = { ...data }
      this.visible.approvalDetails = true
    },
    // 数据获取
    dataList() {
      getDataList(this.queryParam).then(res => {
        this.dataSource = res.data
        this.totalSize = res.totalSize
      })
    },
    //搜索
    search(value) {
      console.log(value)
      this.queryParam = value
      this.$refs.table.refresh(true)
    },
    // 新增
    handleAdd() {
      this.$router.push({
        path: '/technical/newProjects',
        query: {
          id: '',
          pageType: 'add'
        }
      })
      // this.loading = true;
      // increase().then((res) => {
      //      this.loading = false;
      //     if (res.code === 200) {
      //         console.log(res.data.id)
      //         this.$router.push({
      //             path: '/technical/newProjects',
      //             query: {
      //                 id: res.data.id,
      //             },
      //         })
      //     } else {
      //         this.$message.error('新增错误')
      //     }
      // }).catch(() => {
      //     this.loading = false;
      // })
    },
    // 查看
    addSee(id) {
      this.$router.push({
        path: '/technical/standingBook/detailed',
        query: {
          id: id
        }
      })
    },
    // 编辑
    addEdit(id) {
      this.$router.push({
        path: '/technical/newProjectsUpdate',
        query: {
          id: id,
          pageType: 'edit'
        }
      })
    },
    discard(record) {
      let _this = this
      this.$confirm({
        title: '温馨提示',
        content: '确定是否删除数据？',
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk() {
          return listDelete({ id: record.id }).then(res => {
            _this.$message.success('删除成功！')
            _this.$refs.table.refresh(true)
          })
        },
        onCancel() {}
      })
    }
    // // 删除
    // remove(id) {
    //     let params = {
    //         id: id,
    //     }
    //     listDelete(params).then((res) => {
    //         console.log(res.data)
    //         if (res.data.code == '200') {
    //             this.$message.success('删除成功！')
    //             this.$refs.table.refresh(true)
    //         } else {
    //             this.$message.error('已提交不可删除')
    //         }
    //     })
    // },
  }
}
</script>
<style lang="less">
.tx-center {
  text-align: center;
}
.not-submit {
  text-align: center;
  display: inline-block;
  padding: 0;
  li {
    list-style: disc;
    color: red;
  }
}
</style>
